<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>Wiki on Rails :: FrontPage</title>

<link rel="stylesheet" href="/stylesheets/layout.css" type="text/css">
<link rel="stylesheet" href="/stylesheets/style.css" type="text/css">

<style type="text/css">
* {
    margin:0; padding:0;
    color:#333;
}
body {
    background-color:#ddd;
    width:100%;
}

#layout_top {
    width:100%;
    border-bottom:2px solid #fff;
    background-color:#ccb;
    height:80px;
}
#layout_bottom {
    width:100%;
    clear:both;
    background-color:#ccb;
    border-top:2px solid #fff;
    text-align:center;
    padding:1em 0;
}
#layout_middle {
    background-color:#ddd6bb;
}
#layout_left {
    float:left;
    width:150px;
    background-color:#d6d6bb;
    border-right:1px solid #fff;
    border-bottom:1px solid #fff;
}
#layout_center {
    margin-left:150px;
    /*    border-left:1px solid #fff;*/
}
* {
    font-size:1.0em;
    line-height:1.4em;
}

h1 {
    font-size:1.5em;
}
h2 {
    font-size:1.4em;
}
h3 {
    font-size:1.3em;
}
h4 {
    font-size:1.2em;
}
h5 {
    font-size:1.1em;
}
h6 {
    font-size:1.0em;
}
li {
    margin-left:1em;
}

a{
    color:#003d4c;
    text-decoration:underline;
}
a:hover{
    color:#003d4c;
    text-decoration:none;
}

a img{
    border:none;
}

.header {padding:1em}
.footer {font-size:0.8em;}
.menu {padding:1em 0 2em 1em;}
.contents {padding:1em}
.sorthelper {
    border: 3px dashed #666;
    width: auto !important;
}
.handler {background-color:#bbb;}

div.block {margin:0px 0px 20px 0px; }
</style>
<!--script type="text/javascript" src="jquery-1.2.1.js"></script-->
<script type="text/javascript" src="jquery-1.1.4.js"></script>
<script type="text/javascript" src="interface.js"></script>
<script type="text/javascript"><!--
window.edit_start = function() {
    $('div.block').prepend('<div class="handler">ここをドラッグして並べ替え</div>');
    $('div.blocks').Sortable({
        accept : 'block',
        activeclass : 'sortableactive',
        hoverclass : 'sortablehover',
        helperclass : 'sorthelper',
        handle: '.handler',
        opacity:    1,
        axis : 'vertically',
        fit :   true
    });
    $('div.block').append('<input type="button" value="テキストを編集" style="position:;absolute;" onclick="edit_text(this);" class="text_edit_button" />');

    $('#edit_button').html('終了');
    $('#edit_button').attr('onclick', 'edit_end();');
}
window.edit_end = function() {
    $('div.blocks').SortableDestroy();
    $('#edit_button').html('編集');
    $('#edit_button').attr('onclick', 'edit_start();');
    $('.text_edit_button').remove();
    $('.handler').remove();
}
window.edit_text = function(btn) {
    $(btn).val('終了');
    $(btn).attr('onclick', 'end_edit_text(this);');
    $(btn).parent().append('<textarea>' + $('input[@type=hidden]', $(btn).parent()).val() + '</textarea>');
}
window.end_edit_text = function(btn) {
    $(btn).val('テキストを編集');
    $(btn).attr('onclick', 'edit_text(this);');
    $('textarea', $(btn).parent()).remove();
}

//--></script>
</head>
<body>

<div id="layout_body">

<!-- ヘッダー -->
<div id="layout_top">
<div class="header">

<h1>Wiki on Rails :: FrontPage</h1>
<p style="color: green"></p>
</div>
</div>
<!-- /ヘッダー -->

<!-- 中段 -->
<div id="layout_middle">
<!-- メニュー -->
<div id="layout_left">
<div class="menu">
<p>
<h1>menu</h1>

<p>
<a href="#FrontPage">FrontPage</a>
</p>

<p>
<a href="#WikiTest">WikiTest</a>
</p>

<p>
<a href="#WikiOnRailse">WikiOnRailse</a>
</p>

</p>

</div>
</div>
<!-- /メニュー -->

<!-- メインコンテンツ -->
<div id="layout_center">
<div class="contents">

<div class="blocks">

<div class="block" id="0">
<div class="rendered_html">
<h1>タイトル 1</h1>
</div>
<input type="hidden" name="block[0]" class="wiki_text" value="* タイトル 1" />
</div>

<div class="block" id="1">
<div class="rendered_html">
<p>
説明文 説明文 説明文
説明文 説明文 説明文
説明文 説明文 説明文
説明文 説明文 説明文
</p>
</div>
<input type="hidden" name="block[1]" class="wiki_text" value="説明文 説明文 説明文
説明文 説明文 説明文
説明文 説明文 説明文
説明文 説明文 説明文
" />
</div>

<div class="block" id="2">
<div class="rendered_html">
<h2>サブタイトル</h2>
</div>
<input type="hidden" name="block[2]" class="wiki_text" value="** サブタイトル" />
</div>

<div class="block" id="3">
<div class="rendered_html">
<p>
この章の解説この章の解説この章の解説この章の解説この章の解説
この章の解説この章の解説この章の解説この章の解説この章の解説
この章の解説この章の解説この章の解説この章の解説この章の解説
</p>
</div>
<input type="hidden" name="block[3]" class="wiki_text" value="この章の解説この章の解説この章の解説この章の解説この章の解説
この章の解説この章の解説この章の解説この章の解説この章の解説
この章の解説この章の解説この章の解説この章の解説この章の解説
" />
</div>

</div>

<a id="edit_button" href="#?" onclick="edit_start();">編集</a>
<div style="background-color:#f88;"><b><font color="white">wikiデータ編集のイメージです。「編集」リンクをクリックして編集してみてください。</font></b></div>
</div>
<!-- /メインコンテンツ -->

</div>
<!-- /中段 -->

<!-- フッター -->
<div id="layout_bottom">
<div class="footer">

<div>Wiki on Rails 0.0.1 Copyright &copy; 2007 <a href="http://code.google.com/p/wiki-on-rails/">Wiki on Rails Developers Team.</a></div>
<div>License is <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a>. Powered by Ruby on Rails.</div>
</div>
</div>
<!-- /フッター -->

</div>

</body>
</html>
